
/* *{
    margin: 0;
    padding: 0;

} */
/* id选择器 */
#main{
    color: blue;
}
/* 类选择器 */
.news_title{
    color: brown;
}
/* 元素选择器 */
h3{
    color: coral;
}

/* 属性选择器 */
[title]{
    font-size: 1.5em;
}

p[data-bind]{
    color: blue;
}

p[title="abc"]{
    color: chocolate;

}

p[title~="de"]{
    color: orange;
}

p[title|="xyz"]{
    color: fuchsia;
}

a[href][title]{
    color: cadetblue;
    font-size: .75em;
}

/* 伪类与伪元素选择器 */
p:hover{
    background-color: #abc;
}

li:hover{
    background-color: #fbc;
}

a{
    color: red;
}

a:link{
    color:red
}

a:visited{
    color: purple;
}

a:hover{
    font-weight: bold;

}

a:active{
    color:chartreuse;
}
input:focus{
    background-color: #abc;
}

pre:first-child{
    color: red;
}
li:first-child{
    color: red;}

    div p:first-line{
        color: red;
    }

    div p::first-letter{
    font-weight: bold;
    font-size: 200%;    
    }

    div h1:before{
        content: "before";
    }

    div h1:after{
        content: "after";

    }

    /* 组合选择器 */

    div span{
        color: blueviolet;
    }

    p  > span{
        color: hotpink;
    }

    pre + span{
        color: crimson;
    }

    pre ~ span.bro{
        color: forestgreen;
    }
    
    
    
    
